<template>
	<view class="research_box">
		<view class="bar">
			<image class="back" @tap="back" src="../../../../static/funds/back.png"></image>
			<text>风险评测</text>
		</view>
		<swiper class="swiper" :current="current"  :duration="300" :autoplay="false" :interval="1000"  > 
			<swiper-item v-for="(item,index) in riskList" :key="item.id"  @touchmove.stop='stopTouchMove' >
				<view class="top_box">
					<view class="model">
						<text class="title" :class="{titlelan:index==0}" >{{item.id}}.{{item.question}}</text>
					</view>
					<view class="model" v-for="(ite,idx) in item.answer"  :key="idx" @click="changeCurrent(item.id)">
						<text>{{ite.title}}</text>
					</view>
			
					<view class="xian" >
						<text :class="index==0?'lanse':'lan'" :style="'width:'+((index+1) * 66+1) +'rpx'"></text>
						<text class="hui"></text>
					</view>
					<view class="number">{{index+1}}/10</view>
				</view>
				<view class="warn">温馨提示: 填写进行测评问卷时，请您确保选项真是、准确、完整和有效可靠。如问卷中存在欺诈、隐瞒或有其他不实陈述而导致问卷结果与投资实际情况不符，甚至出现投资亏损等情况的。本平台及合作机构不承担任何责任。</view>
			</swiper-item>
		</swiper>
	</view>
</template>

<script>
	export default {
		data() {
			return { 
				current:0,
				riskList: [{
						id: 1,
						question: "您的学历？",
						answer: [{title:"a.硕士及以上",state:0}, {title:"b.本科",state:0}, {title:"c.大专",state:0}, {title:"d.高中/中专",state:0}, {title:"e.初中及以下",state:0}]
					},
					{
						id: 2,
						question: "过去一年内购买过不同金融产品的数量？",
						answer: [{title:"a.12个以上",state:0}, {title:"b.11-15个",state:0}, {title:"c.6-10个",state:0}, {title:"d.5个以下",state:0}, {title:"e.没有",state:0}]
					},
					{
						id: 3,
						question: "您的家庭除日常开销外可用于投资的资产？",
						answer: [{title:"a.1220万以上",state:0}, {title:"b.15-20万",state:0}, {title:"c.5-10万"}, {title:"d.5万以下"}, {title:"e.没有"}]
					},
					{
						id: 4,
						question: "您目前所处的年龄阶段？",
						answer: [{title:"a.56岁以上",state:0}, {title:"b.46-55岁",state:0}, {title:"c.36-44岁",state:0}, {title:"d.28-35岁",state:0}, {title:"e.18-28岁",state:0}]
					},
					{
						id: 5,
						question: "到目前为止，您已有多少年投资经验？",
						answer: [{title:"a.10年以上",state:0}, {title:"b.6-10年",state:0}, {title:"c.3-5年",state:0}, {title:"d.1-3年",state:0}, {title:"e.少于1年",state:0}]
					},
					{
						id: 6,
						question: "您预期的投资期限是？",
						answer: [{title:"a.10年以上",state:0}, {title:"b.6-10年",state:0}, {title:"c.3-5年",state:0}, {title:"d.1-3年",state:0}, {title:"e.少于1年",state:0}]
					},
					{
						id: 7,
						question: "您投资的主要目的是什么？",
						answer: [{title:"a.关心长期的高回报，能够接受短期资产波动",state:0}, {title:"b.倾向长期成长，较少关心短期波动",state:0}, {title:"c.希望投资获得增值，同时获得适度的年回报",state:0},
							{title:"d.只想确保资产的安全性，同时得到固定收益",state:0}, {title:"e.希望获得利益在短期内用于购买计划",state:0}
						]
					},
					{
						id: 8,
						question: "如果发生亏损哪项符合您的态度？",
						answer: [{title:"a.如果发生亏损，我并不在乎",state:0}, {title:"b.我能承受25%内的损失",state:0}, {title:"c.我只能承受10%的亏损",state:0}, {title:"d.我几乎不能承受任何亏损",state:0},
							{title:"e.我需要至少获得高于一定定期存款利率的收益",state:0}
						]
					},
					{
						id: 9,
						question: "以三年的期限来说，您希望您的投资？",
						answer: [{title:"a.超越股市整体增长30%以上",state:0}, {title:"b.超越股市整体增长10-30%",state:0}, {title:"c.与股市保持同步增长",state:0}, {title:"d.略微滞后股市的整体增长",state:0}, {title:"e.无所谓",state:0}]
					},
					{
						id: 10,
						question: "您的家庭目前年收入状况？",
						answer: [{title:"a.50万元以上",state:0}, {title:"b.30-50万元",state:0}, {title:"c.15-30万元",state:0}, {title:"d.5-15万元",state:0}, {title:"e.5万元以下",state:0}]
					},
				],
			}
		},
		methods: {
			stopTouchMove(){
				return false;
			},
			changeCurrent(current){ 
				if(current<=9){
					this.current=current;
				}else{
					try {
					    uni.setStorageSync('level', true);
					} catch (e) {
					    // error
					}
					uni.redirectTo({
						url:"../evaluatingResult/evaluatingResult"
					})
				}
			},
			back(){
				if(this.current>0){
					this.current--;
				}else{
					uni.navigateBack({
						delta:1
					})
				}
			}
		}
	}
</script>

<style scoped lang="scss">
	.research_box{
		padding-top: 50rpx;
		width: 750rpx;
		height: 100vh;
		box-sizing: border-box;
		.bar{
			height: 60rpx;
			position: relative;
			text-align: center;
			font-size: 28rpx;
			line-height: 60rpx;
			.back{
				width: 32rpx;
				height: 32rpx;
				position: absolute;
				left: 44rpx;
				top: 50%;
				margin-top: -12.5rpx;
			}
		}
		.swiper{
			width: 750rpx;
			height: calc(100vh - 110rpx );
			.top_box{
				height: 800rpx;
				background-color: white;
				box-sizing: border-box;
				padding-left: 45rpx;
				padding-right: 45rpx;
				.model{
					height: 90rpx;
					line-height: 90rpx;
					font-size: 28rpx;
					color: #666666;
					border-bottom: 1rpx solid #f8f8f8;
					.title{
						color:black;
						font-size: 32rpx;
					}
					.titlelan{
						color:$uni-global-color-theme;
					}
				}
				.model.no_under{
					border-bottom:none;
				}		
				.xian{
					margin-top: 170rpx;
					display: flex;
					.lanse{
					height: 8rpx;
					background-color:$uni-global-color-theme;	
					}
					.lan{
					height: 8rpx;
					background-color:#4d4d4d;
					}
					.hui{
						flex-grow: 1;
						height: 8rpx;
						background-color: #cccccc;	
					}
					
				}
				.number{
					text-align: center;
					font-size: 24rpx;
					color: #666666;
					margin-top: 15rpx;
				}
			}
			.warn{
				box-sizing: border-box;
				padding-left: 45rpx;
				padding-right: 45rpx;
				padding-top: 30rpx;
				font-size: 24rpx;
				color: #888888;
				line-height: 40rpx;
			}
		}
	}
</style>
